<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // proxy(vm, `_data`, key)
        // key  ==> msg , age 
        export function proxy(target: Object, sourceKey: string, key: string) {
            sharedPropertyDefinition.get = function proxyGetter() {
                // this['_data']['msg']
                return this[sourceKey][key]
            }
            sharedPropertyDefinition.set = function proxySetter(val) {
                this[sourceKey][key] = val
                // this['_data']['msg'] = val
        }
        // target ==>  vm 
        // key    ==>  msg 
        // vm.msg ==>  vm._data.msg 

        // sharedPropertyDefinition = {
        //     get:function proxyGetter() {
        //         // this['_data']['msg']
        //         return this[sourceKey][key]
        //     },
        //     set:function proxySetter(val) {
        //         this[sourceKey][key] = val
        //     }
        // }
        Object.defineProperty(target, key, sharedPropertyDefinition)

        }

        Object.defineProperty(vm, 'msg', {
                get: function proxyGetter() {
                    // this['_data']['msg']
                    return this['_data']['msg']
                },
                set: function proxySetter(val) {
                    this['_data']['msg'] = val
                }
        } )

        // vm.msg  ==>  vm._data.msg 
        // vm.age  ==>   vm._data.age 

        // vm.msg = 'hello'  ==>  vm._data.msg = 'hello'


        // 源码 没动的部分
        // proxy(vm, `_data`, key)
        export function proxy(target: Object, sourceKey: string, key: string) {
            sharedPropertyDefinition.get = function proxyGetter() {
                // this['_data']['msg']
                return this[sourceKey][key]
            }
            sharedPropertyDefinition.set = function proxySetter(val) {
                this[sourceKey][key] = val
            }
            // target ==> vm 
            // key    ==>  msg 
            // vm.msg ==>  vm._data.msg 
            // Object.defineProperty(vm, 'msg', )
            Object.defineProperty(target, key, sharedPropertyDefinition)
        }
     </script>
</body>
</html>